<template>
  <div class="swiper-container">
         <div class="swiper-wrapper">
               <div class="swiper-slide" v-for="item in init" :key="item.bannerId">
                 <img :src="item.imgUrl"  />
               </div>
         </div>
         <!-- 如果需要分页器 -->
         <div class="swiper-pagination"></div>
         
   </div>
</template>

<script>
import Swiper from 'swiper';
import "swiper/css/swiper.css";
export default {
   props:["init"],
    mounted(){
                 var mySwiper = new Swiper ('.swiper-container', {
                       autoplay: {
                            delay: 2000,
                         
                            disableOnInteraction: false,
                         },
                        loop: true, // 循环模式选项
                        
                        // 如果需要分页器
                        pagination: {
                         el: '.swiper-pagination',
                        }
                        
                        
                 })        
        }
}
</script>

<style>

.swiper-container{
      height:4.0332rem;
}
.swiper-container img{
        width: 100%;
        height:4.0332rem;
    }
</style>